<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <!-- 表单控件要写在表单元素中form action提交用户的服务器地址 -->
    <form action="test.php"method="post">
    <!-- 明文输入框 -->
    用户名：<input type="text">
    <!-- 暗纹输入框 -->
    密码：<input type="password"><br>
    <!-- 强制换行标签 -->
     <!-- 单选按钮或者输入框要聚焦label 与for input id要一致 -->
    性别：
    <label for="">
         男：<input type="radio" checked name="gender" value="male"id="list">
    </label>
    <label>
    女：<input type="radio" name="gender" value="female"><br>
</label>
</form>
<!-- checked可以设置单选按钮和复选框默认选中 -->
爱好：
游泳：<input name="hobbies"type="checkbox"value="swing">
篮球：<input checkedname="hobbies"type="checkbox"value="basketball">
足球：<input name="hobbies"type="checkbox"value="football"><br>
城市：
  <select name="city">
    <!-- 对下拉选项分组 -->
    <optgroup label="一线城市">
        <option value="lanzhou">兰州</option>
        <option value="tianshui">天水</option>
        <option value="baiyin"selected>白银</option>
    </optgroup>
    <!-- disabled禁用 -->
    <optgroup label="二线城市"disabled>
        <option value="beijing">北京</option>
        <option value="shanghai">上海</option>
        <option value="tianjin">天津</option>
    </optgroup>
  </select><br>
  描述：<textarea name="des" cols="30"row= "10"></textarea><br>
生日：<input type="datetime-local" >
日期：<input type="date" ><br>
文件上传：<input type="file" ><br>
滑块:
<input type="range" value="" min="{5"} max="" step="" required="required" title="">
颜色取色器：<input type="color" >
进度条:<progress min="0"max="100"value="55"></progress>
<!-- 表单提交按钮 -->
 <input type="submit" value="提交">
</body>
</html>